

<template>
  <div class="love">
    <button @click="getTalk">获取一句话</button>
    <h2>组合式写法getters: {{ bigSum }}</h2>
    <ul>
      <li v-for="(item,index) in loveStore.list" :key="index">
        {{ item }}
      </li>
    </ul>
    <ul>
      <li v-for="(item,index) in list" :key="index">
        {{ item }}
      </li>
    </ul>
  </div>

</template>

<script setup lang="ts" name="Love">
import { useLoveStore } from '@/store/love(组合式写法)'
import { storeToRefs } from 'pinia'

let loveStore = useLoveStore()

// $subscribe 可以用来做 刷新不丢失的功能
loveStore.$subscribe((mutata, state)=>{
  console.log('loveStore中保存的数据发生了变化')
  localStorage.setItem('list', JSON.stringify(state.list))
}) 












const { list ,bigSum } = storeToRefs(loveStore)

const getTalk = async () => {
  loveStore.getTalk()
}

</script>

<style scoped>
.love {
  background: orange;
    padding: 10px;
    border-radius: 10px;
    box-shadow: 0 0 10px;
}
</style>
